<template>
  <el-drawer
    :with-header="false"
    :visible="show"
    size="800px"
    @update:visible="updateVisable($event)"
  >
    <el-main>
      <el-button
        icon="el-icon-close"
        circle
        style="float: right"
        @click="updateVisable(false)"
      />
      <div class="batch-title">会员头像</div>
      <el-card
        shadow="hover"
        class="order-block"
      >
        <img :src="memberPhoto" class="member-image"/>
      </el-card>
      <description
        title="会员信息"
        :items="memberProps"
        :span="24"
        style="margin-top: 16px"
      />
    </el-main>
  </el-drawer>
</template>
<script>
import Description from "@/components/description/index.vue";
import {Status} from "@/utils/constant/orderStatus";
import { parseTime } from "@/utils/common.js";
import {PayWay} from "@/utils/constant/payWay";

export default {
  components: {
    description: Description
  },
  props: {
    // 是否显示, 支持 sync
    show: {
      type: Boolean,
      default: false
    },
    member: {
      type: Object
    }
  },
  data() {
    return {};
  },
  computed: {
    memberPhoto(){
      if(this.member.photo){
        return '/upload/'+this.member.photo;
      }else{
        return '/images/0.jpg';
      }
    },
    memberProps() {
      const result = [];
      console.log(this.member);
      if (this.member) {
        result.push({
          label: "openid",
          text: this.member["openId"]
        });
        if(this.member["name"]){
          result.push({
            label: "姓名",
            text: this.member["name"]
          });
        }
        if(this.member["phone"]){
          result.push({
            label: "电话",
            text: this.member["phone"]
          });
        }
        if(this.member["email"]){
          result.push({
            label: "邮箱",
            text: this.member["email"]
          });
        }
        result.push({
          label: "类型",
          text: this.member["memberExt"]["type"]==1?"超级会员":"普通会员"
        });
        result.push({
          label: "余额",
          text: this.member["memberExt"]["money"]/100+"元"
        });
        result.push({
          label: "积分",
          text: this.member["memberExt"]["integral"]
        });
        result.push({
          label: "创建时间",
          text: parseTime(this.member["createTime"])
        });
        result.push({
          label: "最后修改时间",
          text: parseTime(this.member["updateTime"])
        });
        if(this.member["remark"]){
          result.push({
            label: "备注",
            text: this.member["remark"]
          });
        }
      }
      return result;
    }
  },
  methods: {
    updateVisable(v) {
      this.$emit("update:show", v);
    }
  }
};
</script>
<style lang="scss" scoped>
::v-deep .el-drawer__body {
  overflow: scroll;
}
.batch-title {
  margin-bottom: 16px;
  color: rgba(0, 0, 0, 0.85);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.5;
}
.batch-block {
  margin-bottom: 16px;
}
.member-image{
  width: 100px;
  height: 100px;
}
</style>
